<html>
	<head>
		<link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css ">
		  <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js "></script>
		  <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js "></script>
		  <script>
		  $(function() {
		    $( "#dialog" ).dialog(
		    {
		      autoOpen: false,
		      show: {
		        effect: "scale",
		        duration: 1000
		      		},
		      hide: {
		        effect: "explode",
		        duration: 1000
		     		 }
		    });
		    $( "#opener" ).click(function() {
		      $( "#dialog" ).dialog( "open" );
		    });
		  });
		  </script>
		  <script>
		  $(function() {
		    $( "#dialog1" ).dialog(
		    {
		      autoOpen: false,
		      show: {
		        effect: "scale",
		        duration: 1000
		      		},
		      hide: {
		        effect: "explode",
		        duration: 1000
		     		 }
		    });
		  });

		   teacherNames = new Object();
		  <#list classlist as cl>
		  		var course=teacherNames['${cl.courseName}'];
		  		if(course!=null)
		  			course.push('${cl.teacherName}','${cl.classId}');
		  		else
		  			teacherNames['${cl.courseName}']=new Array('${cl.teacherName}','${cl.classId}');
		  </#list>
		
		
		  function editstudent(Id,Number,Name,Class,Grade,Password,courseName,classId,teacherName){
		  	var obj = document.getElementById('dialog1').getElementsByTagName("INPUT");
		  	for(var i=0;i<obj.length;i++){
		  		switch(i){
		  			case 0:obj[i].value=Id;break;
		  			case 1:obj[i].value=Number;break;
		  			case 2:obj[i].value=Name;break;
		  			case 3:obj[i].value=Class;break;
		  			case 4:obj[i].value=Grade;break;
		  			case 5:obj[i].value=Password;break;
		  			case 6:obj[i].value=Id;break;
		  		}
		  	}  
		  	var sec = document.getElementById('dialog1').getElementsByTagName("select");
		  	for(var i=0;i<sec.length;i++){
		  	//sec.length=2;代表有两个select
		  		switch(i){
		  			case 0:
				  		 for(j=0;j<sec[i].length;j++){//给select赋值  
				              if(courseName==sec[i].options[j].value){  
				                  sec[i].options[j].selected=true;
				                  //填充
				                    var cov,clv;
								    var i, ii=1;
								    clv=classId;
								    cov=courseName;
								    if(cov=='0') return;
								    if(typeof(teacherNames[cov])=='undefined') return;
								    for(k=0; k<teacherNames[cov].length; k+=2,ii++){
								       sec[1].options[ii] = new Option();
								       sec[1].options[ii].text = teacherNames[cov][k];
								       sec[1].options[ii].value = teacherNames[cov][2*k+1];
								    } 
								    //alert(sec[1].options);
								    break;
				              }   
				           }  
		  				break;
		  			case 1:
		  					//alert(sec[i].length);
		  					for(j=0;j<sec[i].length;j++){
		  						if(classId==sec[i].options[j].value){
		  							sec[i].options[j].selected=true;
		  							break;
		  						}
		  					} 
		  				break;
		  		}
		  	}
		  	$( "#dialog1" ).dialog( "open" );
		  }
		  	

			function set_classId(courseName,classId)
			{
				var length = classId.options.length;
				while(length!=1){
				  for(var i = 1;i<length;i++){
				   classId.options.remove(i);
				   length = length-1;
				   }
				 }
			    var cov,clv;
			    var i, ii=1;
			    clv=classId.value;
			    cov=courseName.value;
			  //courseName.length=1;
			    if(cov=='0') return;
			    if(typeof(teacherNames[cov])=='undefined') return;
			    for(i=0; i<teacherNames[cov].length; i+=2,ii++)
			    {
			       classId.options[ii] = new Option();
			       classId.options[ii].text = teacherNames[cov][i];
			       classId.options[ii].value = teacherNames[cov][2*i+1];
			    }
			}
		  </script>
	
		  <script>
		  	function newnotnull(){
				var ab = document.getElementById('dialog').getElementsByTagName("INPUT");
				for(var i=0;i<ab.length;i++){
					ab[i].value = $.trim(ab[i].value); // 用jQuery的trim方法删除前后空格
					if(ab[i].value==""||ab[i].value==null){
						    alert("请仔细检查，输入不能为空!");
						    return false;
					}
				}
				if(document.getElementsByName("classId")[0].value=="0"||
				   document.getElementsByName("courseName")[0].value=="0"){
					alert("请仔细检查，选择不能为空!");
					return false;
				}
			}
		  </script>
		  <script>
		  	function editnotnull(){
				var ab = document.getElementById('dialog1').getElementsByTagName("INPUT");
				for(var i=0;i<ab.length;i++){
					ab[i].value = $.trim(ab[i].value); // 用jQuery的trim方法删除前后空格
					if(ab[i].value==""||ab[i].value==null){
						    alert("请仔细检查，输入不能为空!");
						    return false;
					}
				}
				
				if(document.getElementsByName("classId")[1].value=="0"||
				   document.getElementsByName("courseName")[1].value=="0"){
					alert("请仔细检查，选择不能为空!");
					return false;
				}
			}
		  </script>
	</head>
	<body>
		<h1 style="text-align:center;font-family:arial;color:block;letter-spacing:2px;"><font size="50">小学生答题测试系统</font></h1>
		<p style="text-align:center;word-spacing:5px">
		<font size="6">
	    <a href="/introduce.html">首页</a>&nbsp;
	    <a href="/classes.html">教学班</a>&nbsp;&nbsp;
	    <a href="/student.html">学生</a>&nbsp;&nbsp;
	    <a href="/course.html">课程</a>&nbsp;&nbsp;
	    <a href="/question.html">题库</a>&nbsp;&nbsp;
	    <a href="/exam.html">测验</a>&nbsp;&nbsp;
	    <a href="/loginUser.html">登录</a>&nbsp;&nbsp;
	    </font>
	    </p>
		<div	align="center">
			<table  cellspacing="0" width=800>
				<tr height="30">
					<th>课程名称</th>
					<th>任课教师</th>
					<th>学生年级</th>
					<th>学生班级</th>
					<th>学生学号</th>
					<th>学生姓名</th>
					<th>学生账号</th>
					<th>学生密码</th>
					<th colspan="2">操作</th>
				</tr >
				<#list studentslist as st>
						<tr align="center" height="20">
							<td id="courseName">${st.courseName} </td>
							<td id="teacherName">${st.teacherName} </td>
							<td id="studentGrade">${st.studentGrade}</td>
							<td id="studentClass">${st.studentClass}</td>
							<td id="studentNumber">${st.studentNumber}</td>
							<td id="studentName">${st.studentName}</td>
							<td id="studentId">${st.studentId}</td>
							<td id="studentPassword">${st.studentPassword}</td>
							<td><a href="/Student/delete?id=${st.studentId}"><button>删除</button></a></td>
							<td><button  onclick="editstudent(${st.studentId},'${st.studentNumber}','${st.studentName}','${st.studentClass}',
							'${st.studentGrade}','${st.studentPassword}','${st.courseName}','${st.classId}','${st.teacherName}')">编辑</button></td>
						</tr>
				</#list>				
				<tr height="50">
					<td colspan="9" align="center"  style="border:0px">
						<button id="opener">新建</button>
					</td>
				</tr>
				<tr height="20">
					<td colspan="8" align="center">
						<input type="file" value="批量导入"></input>
					</td>
				</tr>
			</table>
		</div>
		
		<div title="新加课程内容" id="dialog" >
			<form  method ="post"  action="/students/insert" onsubmit="return newnotnull() ">
		    		<!-- 学生账号实现自增长模式 -->
		    		课程名称：<select name="courseName" style="width:100px" onChange="set_classId(this,this.form.classId)">
								<option value="0">--请选择--</option>
								<#list CourseNamelist as co>
									<option value="${co.courseName}">${co.courseName}</option>
								</#list>
					</select><br></br>
					老师姓名： <select name="classId" style="width:100px">
					 			<option value="0">--请选择--</option>
					</select><br></br> 
		    		 班级学生信息： <input type="text" id="studentNumber" name="studentNumber" placeholder="请输入学生学号"></input><br></br>
					<input type="text" id="studentName" name="studentName" placeholder="请输入学生姓名"><br></br>
					<input type="text" id="studentClass" name="studentClass" placeholder="请输入学生班级"><br></br>
		    		<input type="text" id="studentGrade" name="studentGrade" placeholder="请输入学生年级"><br></br>
					<input type="text" id="studentPassword" name="studentPassword" placeholder="请输入学生密码"><br></br>
		  		  	<input type="submit" value ="确定" ></input>
		  	  </form>
		</div>
		
		<div title="编辑课程内容" id="dialog1" >
			<form  method ="post"  action="/students/update" onsubmit="return editnotnull()">
		    		<!-- 学生账号实现自增长模式 -->
		    		<!-- 学生账号实现自增长模式 -->
		    		课程名称：<select name="courseName" style="width:100px" onChange="set_classId(this,this.form.classId)">
								<option value="0">--请选择--</option>
								<#list CourseNamelist as co>
									<option value="${co.courseName}">${co.courseName}</option>
								</#list>
					</select><br></br>
					老师姓名： <select name="classId" style="width:100px">
					 			<option value="0">--请选择--</option>
					</select><br></br> 
					 学生账号：<input type="text" id="studentId" name="studentId" disabled="disabled"></input><br></br>
		    		 班级学生信息： <input type="text" id="studentNumber" name="studentNumber" placeholder="请输入学生学号"><br></br>
					<input type="text" id="studentName" name="studentName" placeholder="请输入学生姓名"><br></br>
					<input type="text" id="studentClass" name="studentClass" placeholder="请输入学生班级"><br></br>
		    		<input type="text" id="studentGrade" name="studentGrade" placeholder="请输入学生年级"><br></br>
					<input type="text" id="studentPassword" name="studentPassword" placeholder="请输入学生密码"><br></br>
					<input type="hidden" id="studentId" name="studentId" >
		  		  	<input type="submit" value ="确定" ></input>
		  	  </form>
		</div>
	</body>
</html>